<template>
    <div>
        <!-- 进出站管理-进站查询 -->
        <div class="top-container">
            <div class="container">
                <div class="content">
                    <avue-form ref="form" style="width: 60%" v-model="date" :option="operateTime" class="yz-form lf"></avue-form>
                    <el-form ref="form" label-width="80px">
                        <el-col :span="4">
                            <el-form-item label="车牌号" label-width="80px">
                                <el-autocomplete v-model="cardCodeTips" placeholder="" size="mini" :fetch-suggestions="querySearchCode"></el-autocomplete>
                            </el-form-item>
                        </el-col>
                    </el-form>
                    <button class="check-btn rf" @click="searchBusList"><!-- " -->
                        <img src="../../assets/imgs/operation_btn_icon_chaxun_default.png" alt="" class="btn-img">
                        查询</button>
                </div>
                <div  style="border-bottom: 1px solid #eee; height: 1px;width: 100%" class="lf"></div>
                <el-row style="width: 100%" class="lf">
                    <el-col :span="24">
                        <avue-crud @current-change="rowChange" :data="bearFruit" :page="page" :option="dataForm"></avue-crud>
                    </el-col>
                </el-row>
            </div>
        </div>
    </div>
</template>

<script>
import "../../assets/js/jquery.js";
// import TableData from "../../components/common/tableData";
// import qs from "qs";


export default {
    data: function(){
        return {
            date:{},
            restaurants:[],
            cardCodeTips: "",
            page: {
                pageSizes: [10],//分页信息 pageSize
                total: 20,//总页数 totalRow
                currentPage: 1,//当前第几页 pageNumber

                pageSize: 10,//每一页加载多少条数据
            },
            carData:{},
            bearFruit:[],//最后写入push返回的数据
            operateTime:{
                labelWidth:80,
                column:[
                    {
                        label: "操作时间",
                        prop: "daterange",
                        type: "daterange",
                        startPlaceholder: '324',
                        endPlaceholder: '4324b',
                    },
                   /* {
                        label: "车牌号",
                        prop: "cardNumber",
                    }*/
                ]
            },
            dataForm:{
                page:true,
                align:'center',
                addBtn:false,//是否添加按钮
                delBtn:false,//是否添加删除按钮
                editBtn:false,//是否添加编辑按钮
                menu:false,//是否添加菜单按钮
                column:[
                    {
                        label:'车牌号',
                        prop:'vehi_no',
                    },
                    {
                        label:'进站人数',
                        prop:'che_shang_yi_you_ren_shu',
                    },
                    {
                        sortable:true,
                        label:'进站时间',
                        prop:'create_time',
                    },
                    {
                        label:'备注',
                        prop:'bei_zhu'
                    }
                ]
            }
        }
    },
    methods:{

        searchBusList(){ //点击查询
            var self = this;
            //console.log(self.date.daterange[0]); 日期没选择的时候日期是 undefined而不是空字符串
            var checkDate = self.date.daterange[0];
            var checkDate1 = self.date.daterange[1];
            this.postRequest("/stationmanage/inbound/bus/list",
                {
                    filterRules: JSON.stringify([ //that.checkDate == "" ? that.dateToString(new Date) : that.dateToString(that.checkDate)
                        {"field":"bus_plan_in_bound_log.create_time",
                            //如果时间为空或者是undefined
                            "op":"dge","value":checkDate === undefined || checkDate === ''?self.dateToString(new Date) : self.dateToString(checkDate)
                        },
                        {"field":"bus_plan_in_bound_log.create_time",
                            "op":"dle","value":checkDate1 === undefined || checkDate1 === ''?self.dateToString(new Date) : self.dateToString(checkDate1)
                        },
                        {"field":"vehi_no","op":"eq","value":self.cardCodeTips}
                    ]),order: 'desc',page: '1',rows: '30'
                },
            ).then(target=>{
                console.log(target);
                var tag = target.data.list;
                //页码大小
                this.page.pageSize = target.data.pageSize;
                //页码数
                this.page.pageNumber = target.data.pageNumber;
                //总页数
                this.page.total = target.data.totalRow;

                this.bearFruit = tag;
            });
        },

        loadList(){ // 默认加载列表
            this.postRequest("/stationmanage/inbound/bus/list",{order: 'desc',page: this.page.currentPage,rows: '10'})
                .then(target => {
                    console.log(target);
                    var tag = target.data.list;
                    //页码大小
                    this.page.pageSize = target.data.pageSize;
                    //页码数
                    this.page.pageNumber = target.data.pageNumber;
                    //总页数
                    this.page.total = target.data.totalRow;

                    this.bearFruit = tag;
            });
        },
        rowChange(val){
            console.log(val);
            this.page.currentPage = val;
            this.loadList();
        },

        querySearchCode(queryString, cb) {//获取焦点车牌号自动下拉提示
            var restaurants = this.restaurants;
            var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants;
            // 调用 callback 返回建议列表的数据
            cb(results);
        },
        createFilter(queryString) {
            return (restaurant) => {
                return (restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
            };
        },
        loadAll() {
            return [ ];
        },
        searchCode(){
            this.$http.post("/sch/data/bus_vehicle/listWithSpell")
                .then(target => {
                    // console.log(target.data);
                    var tag = target.data;
                    for(var i=0;i<tag.length;i++){
                        // console.log(tag[i].vehi_no);
                        // console.log(this.loadAll.value);
                        this.restaurants.push({"value":tag[i].vehi_no});
                    }
                });
        },

    },
    computed:{},
    watch:{

    },
    mounted() {
        this.loadList();
        this.searchCode();
        this.$emit("sendActive","2-2");
        this.restaurants = this.loadAll();
        // this.$emit("sendTag",2);
    }
}
</script>
<style scoped src="../../assets/css/inoutManage/getInSearch.css">
</style>
